/* 根元素样式 设置页面背景、字体大小、字体颜色，字符间距、长单词换行 */
page {
    background-color: #f3f3f3;
    font-size: 28rpx;
    box-sizing: border-box;
    color: #333;
    letter-spacing: 0;
    word-wrap: break-word;
  }
  
  /* 设置常用元素尺寸规则 */
  view,textarea,input,label,form,button,image{box-sizing: border-box;}
  /* 按钮样式处理 */
  button{font-size: 28rpx;}
  /* 取消按钮默认的边框线效果 */
  button:after{border:none;}
  /* 设置图片默认样式，取消默认尺寸 */
  image{display: block;height: auto;width: auto;}
  /* 输入框默认字体大小 */
  textarea,input{font-size: 28rpx;};
  
  /* 列式弹性盒子 */
  .flex_col {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
    align-content: center;
    padding: 0rpx 30rpx;
  }
  /* 行式弹性盒子 */
  .flex_row {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: flex-start;
    align-content: flex-start;
  }
   
  /* 弹性盒子弹性容器 */
  .flex_col .flex_grow{width:0;flex-grow: 1;}
  .flex_row .flex_grow{flex-grow: 1;}
   
  /* 弹性盒子允许换行 */
  .flex_col.flex_wrap{flex-wrap: wrap;}
   
  /* 弹性盒子居中对齐 */
  .flex_col.flex_center,.flex_row.flex_center{justify-content: center;}
   
  /* 列式弹性盒子两端对齐 */
  .flex_col.flex_space{justify-content: space-between;}
  
  /* 弹性盒子快速分栏 ,这里非常郁闷 uniapp 居然不支持 * 选择器 */
  .flex_col.flex_col_2>view{width: 50%;}
  .flex_col.flex_col_3>view{width: 33.33333%;}
  .flex_col.flex_col_4>view{width: 25%;}
  .flex_col.flex_col_5>view{width: 20%;}
  .flex_col.flex_col_6>view{width: 16.66666%;}
  
  /* 字体颜色 */
  .color_333 {color: #333;}
  .color_666 {color: #666;}
  .color_999 {color: #999;}
  .color_ccc {color: #ccc;}
  .color_fff {color: #fff;}
  .color_6dc{color: #6dca6d;}
  .color_d51{color: #d51917;}
  .color_09f{color: #0099ff;}
   
  /* 背景色*/
  .bg_fff{background-color: #ffffff;}
   
  /* 字体大小 */
  .size_10 {font-size: 20rpx;}
  .size_12 {font-size: 24rpx;}
  .size_14 {font-size: 28rpx;}
  .size_16 {font-size: 32rpx;}
  .size_18 {font-size: 36rpx;}
  .size_20 {font-size: 40rpx;}
   
  /* 字体加粗 */
  .font_b{font-weight: bold;}
   
  /* 对齐方式 */
  .align_c{text-align: center;}
  .align_l{text-align: left;}
  .align_r{text-align: right;}
   
  /* 遮罩 */
  .shade{
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: rgba(0,0,0,0.8);
    z-index: 100;
  }
   
  /* 弹窗 */
  .shade_box{
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    z-index: 101;
    min-width: 200rpx;
    min-height: 200rpx;
  }